<!-- 总人数对比 -->
<div class="card comparison-card" id="total-card">
    <div class="card-header">
        <h5><i class="fas fa-users me-2"></i>人员信息对比</h5>
    </div>
    <div class="card-body" id="total-comparison">
        <div class="d-flex justify-content-center">
            <div class="spinner-border" role="status">
                <span class="visually-hidden">Loading...</span>
            </div>
        </div>
    </div>
</div>

<!-- 职级分布对比 -->
<div class="card comparison-card" id="rank-card">
    <div class="card-header">
        <div class="d-flex justify-content-between align-items-center w-100">
            <h5><i class="fas fa-chart-bar me-2"></i>职级分布对比</h5>
            <select class="form-select" style="width: auto;" id="series-filter">
                <option value="P序列" selected>P序列</option>
                <option value="M序列">M序列</option>
                <option value="B序列">B序列</option>
                <option value="all">全部序列</option>
            </select>
        </div>
    </div>
    <div class="card-body" id="rank-comparison">
        <div class="d-flex justify-content-center">
            <div class="spinner-border" role="status">
                <span class="visually-hidden">Loading...</span>
            </div>
        </div>
    </div>
</div> 